<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8"%>
<%@ include file="/WEB-INF/jsp/common.jsp"%>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<%@ include file="/WEB-INF/jsp/importHead.jsp"%>
<%@ include file="/WEB-INF/jsp/importCommonCss.jsp"%>
<link rel="stylesheet" type="text/css" href="${basePath }/css/index-old.css" />
<style>
body.met-navfixed {
	margin: 0 auto;
	padding: 0;
	height: 100%;
	padding-top: 65px;
	min-height: 595px;
}

html {
	margin: 0 auto;
	padding: 0;
	height: 100%;
	min-height: 595px;
	position: relative;
}

html, body {
	margin: 0px;
	height: 100%;
}

body.met-navfixed>section.notice_list_met_11_1 {
	visibility: inherit;
	opacity: 1;
	transform: matrix(1, 0, 0, 1, 0, 0);
	background-color: #F5F5F5;
}

body.met-navfixed>section.notice_list_met_11_1 div.container.notice {
	height: auto;
	line-height: normal;
}

div.form-group>label.form-control-label {
	height: auto;
	line-height: normal;
}

footer.foot_info_met_16_1 {
	background-color: #F5F5F5;
	width: 100%;
}

.red {
	color: red;
}

form.form-horizontal button.btn{
    padding-left: 1.5em;
    padding-right: 1.5em;
    border-radius: 5px;
}

#errorMessageContent label.form-control-label {
    height: 2.573rem;
}
</style>
</head>
<body class="met-navfixed">
	<c:set var="maxTime" value="60" />
	<%@ include file="/WEB-INF/jsp/loginHeader.jsp"%>
	<section class="notice_list_met_11_1 text-xs-left" m-id="4">
	<div class="container notice clearfix" style="min-height: 532px; min-width: 600px;padding: 20px 130px 40px 130px;">
		<form action="${basePath }/yzService" method="post"" class="form-horizontal container" id="validateForm">
			<input type="hidden" name="yzId" value="${yzId }">
			<div class="container-fluid" style="padding-bottom: 100px;">
				<div class="col-xs-12">
					<p>激活短信已发送至您的注册手机${phonenum }，请查收并输入验证码进行激活  ！</p>
				</div>
				<div class="col-xs-12">
					<label class="form-control-label pull-left" style="padding-left: 0;">
						激活验证码：
					</label>
					<div class=" col-xs-3" style="padding: 0">
						<input type="text" name="yzm" class="form-control" maxlength="6" onfocus="$('#errorMessage').hide()" />
					</div>
					<div class=" col-xs-6">
						<button class="btn btn-primary" type="button" id="submitBtn">激活</button>
						<button class="btn btn-primary" type="button" id="retrieveBtn">重新发送</button>
					</div>
				</div>
				<div class="col-xs-12">
					<p id="errorMessage" class="red">${ErrorCode }</p>
				</div>
			</div>
				
			<div class="container-fluid">
				<div class="col-xs-12" style="padding: 30px 0;">
					<span style="color: #008cd6;">还没有收到短信验证码？</span>
				</div>
				<p>1. 稍等片刻，请检查您的手机是否处于正常使用状态（根据正常情况，激活短信会在1分钟之内发送至您的手机）</p>
				<p>2. 可以选择重新发送验证码</p>
				<p>3. 手机号码错了，抱歉您需要重新注册</p>
				<p>4. 如果长时间未收到短信，请改用邮箱激活</p>
			</div>
		</form>
	</div>
	</section>
	<%@ include file="/WEB-INF/jsp/importFooter.jsp"%>
	<%@ include file="/WEB-INF/jsp/importCommonJS.jsp"%>
	<%@ include file="/WEB-INF/jsp/manage/importCommonJS.jsp"%>
	<script type="text/javascript" src="${basePath}/js/layer/layer.js"></script>
	<script>
	var maxTime = 60;
	var tempMaxTime = maxTime;
	
	$(function(){
		watingReSend();
		
		$("#retrieveBtn").bind("click",function(){
			$.ajax({
				url: "${basePath }/retrieve",
				type: "post",
				data: {uuid: "${yzId}",type: "DX",isRegister : true},
				dataType: "text",
				success: function(data){
					if(data == "success"){
						layer.msg("已将验证码发送到邮箱/手机，请注意查收。", {
							time: 2000,
						    icon: 1,
						    skin: 'layer-ext-moon'
						});
						
						watingReSend();
					}
					else if(data == "TP_ER"){
						showErrorMessage("验证方式不正确，请重试");
					}
					else if(data == "UK_ER"){
						showErrorMessage("发送验证码失败，请稍后重试");
					}
					else{
						showErrorMessage("连接服务器发生未知错误");
					}
				},
				error: function(){
					showErrorMessage("连接服务器发生未知错误");
				},
				timeout: function(){
					showErrorMessage("连接服务器超时，请检查网络");
				}
			});
		});
		
		$("#submitBtn").bind("click",function(){
			var identifyingCode = $("#validateForm")[0].yzm;
			if(!identifyingCode || !(identifyingCode.value) || !(identifyingCode.value.replace(/(^\s+)|(\s+)/g,""))){
				showErrorMessage("请输入您收到的验证码");
				return false;
			}
			
			$("#validateForm")[0].submit();
		});
		
		$("#validateForm input").bind("focus",function(){
			$("#errorMessage").hide();
		});
	});
	
	var showErrorMessage = function(text){
		$("#errorMessage").text(text);
		$("#errorMessage").show();

		var timeout = setTimeout(function() {
			$("#errorMessage").hide();
		}, 5000);
	}
	
	var watingReSend = function(){
		$("#retrieveBtn").html("重新发送("+maxTime+")秒");
		$("#retrieveBtn").attr("disabled","disabled");
		
		var temp = setInterval(function(){
			if(tempMaxTime-- > 0){
				$("#retrieveBtn").html("重新发送("+tempMaxTime+")秒");
				$("#retrieveBtn").attr("disabled","disabled");
			}
			else{
				$("#retrieveBtn").html("重新发送");
				clearInterval(temp);
				tempMaxTime = maxTime;
				$("#retrieveBtn").removeAttr("disabled");
			}
		},'1000');
	}
	</script>
</body>
</html>
